<template>
  <dv-border-box8 class="contentCenterBox1_child">
    <div style="width: 98%;height: 49%;">
      <div class="body1">{{ title }}</div>
      <div style="height: 50%;text-align: center;margin-top: -10px;">
        <span style="color:#cdddf7;;font-size: xxx-large;font-weight: bold;">{{ sum }}</span>
        <span style="color: white;font-size: X-large;font-weight: bold;margin-left: 10px;">件</span>
      </div>
    </div>
    <div class="contentCenterBox1_child_line"></div>
    <div style="width: 98%;height: 49%;">

      <div style="height: 33%;width: 100%;text-align: center;">
        <span class="secondBodySpan1" >利润:</span>
        <span class="secondBodySpan2" style="font-size: xx-large">￥</span>
        <span class="secondBodySpan3" style="font-size: xx-large">{{ figure3 }}</span>
      </div>

      <div style="height: 33%;width: 100%;text-align: center;">
        <span class="secondBodySpan1">销售额:</span>
        <span class="secondBodySpan2">￥</span>
        <span class="secondBodySpan3">{{ figure2 }}</span>
      </div>


      <div style="height: 33%;width: 100%;text-align: center;">
        <span class="secondBodySpan1">成本额:</span>
        <span class="secondBodySpan2">￥</span>
        <span class="secondBodySpan3">{{ figure1 }}</span>
      </div>

    </div>
  </dv-border-box8>
</template>

<script>
export default {
  name: "centerDataOrder1",
  props:{
    title:String,
    sum:String,
    figure1:String,
    figure2:String,
    figure3:String,
  }
}
</script>

<style scoped>
.contentCenterBox1_child{
  background-color:  rgba(19, 25, 47, 0.7);
  color: white;
}
.contentCenterBox1_child_line{
  width: 98%;
  height: 2%;
  border-top:2px solid #235fa7;
  margin-left: 4px;
  margin-top: 5px;
}
.body1{
  color: #f50;
  font-size: x-large;
  font-weight: bold;
  height: 50%;
  text-align: center;
  padding-top: 15px;
}
.secondBodySpan1{
  color: #f50;
  font-size: x-large;
  font-weight: bold;
  padding-right: 16px;
}

.secondBodySpan2{
  color:  white;
  font-size: x-large;
  font-weight: bold;
}

.secondBodySpan3{
  color: #ffea8f;
  font-size: x-large;
  font-weight: bold;
}
</style>
